<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>转赠</title>
    <link href="css/swiper.min.css" rel="stylesheet"/>
    <link href="css/public.css" rel="stylesheet"/>
    <link href="css/main.css" rel="stylesheet"/>
    <link href="css/style.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="../mobile/js/layer/css/layui.css" />
    <script src="js/jquery-1.9.1.js"></script>
    <script src="js/layer/layui.js"></script>
    <script src="js/mobile-util.js"></script>
    <script src="js/layer/layer.js"></script>
	<script src="js/public.js"></script>
	<!-- <script src="js/laydate.js"></script> -->
	<style>
		.codebox{
			display: none;
			text-align: center;
			margin-top: 1rem;
			font-size: .6rem;
		}
		.codebox p{
			margin: .5rem 0;
		}
		.realright{
			position: relative;
			width: 100% !important;
		}
		.errmsg{
			position: absolute;
			top: 5px;
			right: 0;
			color: #f00;
			display: none;
		}
		#jibie{
			outline: none;
			position: absolute;
			top: .2rem;
			right: 0;
		    height: .853333rem;
		    line-height: .853333rem;
		    font-size: .512rem;
		    padding: 0 .213333rem;
		    color: #FF503E;
		    border: 1px solid #FF503E;
		    border-radius: .426667rem;
		}
		.chooseOne,.choosebox{
			width: 100%;
			overflow: hidden;
		}
		.chooseOne li{
		}
		.chooseOne li{
			width: 50%;
			float: left;
		}
		.chooseOne li span{
			display: block;
			width: 80%;
			margin: .5rem auto;
			padding: .4rem 10px;
			text-align: center;
			border: 1px solid #ccc;
			background: #fff;
			border-radius: 6px;
		}
		.colors{
			border-color: #f00 !important;
			color: #fff !important;
			background: #EB3F47 !important;
		}
		.realright{
			/*display: block;*/
			display: inherit;
			width: 100%;
		}
		.stylezz{
			width: 100%;
			padding: .6rem 0 .3rem;
			font-size: .7rem;
		}
		.spans{
			width: 40%;
		    height: 1.5rem;
		    line-height: 1.5rem;
		    color: red;
		    border: 0;
		    outline: none;
		}
	</style>

</head>
<body>

<header class="mui-bar mui-bar-nav indexheader flex">
    <div class="headerlogo hide">
        <i class="iconfont backbtn">&#xe602;</i>
    </div>

    <div class="headertitle">
        <p>转赠</p>
    </div>

    <div class="headerright timeright hide">
        <p class="timepbox iconfont">&#xe6d9;</p>

    </div>

</header>


<main class="recordmain">
	<p class="stylezz">请选择转赠方式</p>
	<div class="choosebox">
		<ul class="chooseOne">
			<li><span class="colors">天数</span></li>
			<li><span>流量</span></li>
		</ul>
	</div>
	<div class="contebox">
	<ul class="realui">
		<li class="flex">
			<div class="realright">
				<input type="number" placeholder="请输入您的卡号" class="youkahao youkahao1 shurk" style="height: 1.4rem">
				<span class="errmsg err1">请输入正确的卡号</span>
			</div>
		</li>
		<li class="flex">
			<div class="realright">
				<input type="number" placeholder="请输入对方的卡号" class="otherkahao otherkahao1 shurk" style="height: 1.4rem">
				<span class="errmsg err2">请输入正确对方的卡号</span>
			</div>
		</li>
		<li>
			<div class="realright">
				<input type="number" placeholder="请输入转赠的天数" class="zznum dates shurk" style="height: 1.4rem">
				<span class="errmsg err3">请输入您要转赠的天数</span>
			</div>
		</li>
	</ul>
	<ul class="realui" style="display: none;">
		<li class="flex">
			<div class="realright">
				<input type="number" id="spannumber" placeholder="请输入您的卡号" class="youkahao youkahao2 shurk" onblur="updates()" style="height: 1.4rem"><span class="spans"></span>
				<span class="errmsg err1">请输入正确的卡号</span>
			</div>
		</li>
		<li class="flex">
			<div class="realright">
				<input type="number" placeholder="请输入对方的卡号" class="otherkahao otherkahao2 shurk" style="height: 1.4rem">
				<span class="errmsg err2">请输入正确对方的卡号</span>
			</div>
		</li>
		<li>
			<div class="realright">
				<input type="number" placeholder="请输入转赠的数量" class="zznum liuliang shurk" style="height: 1.4rem">
				<span class="errmsg err3">请输入您要转赠的流量</span>
			</div>
		</li>
	</ul>
</div>
<input type="hidden" value="1" id="types">
	<div class="ma-speen-5">
		<input type="button" value="确定转赠"  onclick="zzajax()"  class="rechargebtn">
	</div>
</main>

</body>

<script src="../mifiadmin/js/common.js"></script>
<script>

$('.chooseOne>li').click(function(){


	$('.youkahao').val('');
	$('.otherkahao').val('');
	$('.zznum').val('');


	$(this).find('span').addClass('colors').parent().siblings('li').find('span').removeClass('colors');
	var index = $(this).index();
	$('.contebox>.realui').eq(index).show().siblings('.realui').hide();
	index = index+1;
	$('#types').val(index);
})
function updates(){
    var spannumber = $('#spannumber').val();
    if(spannumber == ''){
    	layer.open({
		    content: '请填写卡号'
		    ,skin: 'msg'
		    ,time: 2 //2秒后自动关闭
		  });
		return false;
    }
    $.ajax({
      type : 'post',
      url: url+'/Mobile/Userapi/allflows',
      data : {spannumber:spannumber},
      dataType : 'json',
      success : function(data){
        if (data.code == 1) {
        	$('.spans').html('可用流量:'+data.flow+'G')
        }else{
        	layer.open({
			    content: data.msg
			    ,skin: 'msg'
			    ,time: 2 //2秒后自动关闭
			  });
        }
        
      }
    })
}

function zzajax(){
	var types = $('#types').val();
	//流量
	if (types == 2) {
		var otherkahao = $('.otherkahao2').val();
		var youkahao = $('.youkahao2').val();
		var zznum = $('.liuliang').val();
	}
	//天数
	if (types == 1) {
		var otherkahao = $('.otherkahao1').val();
		var youkahao = $('.youkahao1').val();
		var zznum = $('.dates').val();	
	}
	if(youkahao !='' &&　otherkahao !='' && zznum !=''){
		if (youkahao == otherkahao) {
			layer.open({
				    content: '不能填相同的账号'
				    ,skin: 'msg'
				    ,time: 2 //2秒后自动关闭
				  });
				return false;
			}

		$.ajax({
			url: url+'/Mobile/Userapi/tranfer',
			dataType:'json',
			type: 'post',
			data:{
				youkahao: youkahao,
				otherkahao: otherkahao,
				zznum: zznum,
				types: types
			},
			success:function(res){
				if (res.code == 0) {
					layer.open({
					    content: res.msg
					    ,skin: 'msg'
					    ,time: 2 //2秒后自动关闭
					  });
					$('.spans').html('可用流量:'+res.flow+'G')
				}else{
					layer.open({
					    content: res.msg
					    ,skin: 'msg'
					    ,time: 2 //2秒后自动关闭
					  });
				}
			}
		})
	}else{
		$.each($('.shurk'),function(i,val){
			if($('.shurk').eq(i).val() == ''){
				var index = i;
				$('.errmsg').eq(index).show();
			}else{
				var index = i;
				$('.errmsg').eq(index).hide();
			}
		})
	}
}


$("#equipment").keydown(function(event) {
	var reg = /^\d{32}$/;
	var value = $(this).val();
	var e = event || window.event || arguments.callee.caller.arguments[0];

	if(e.keyCode === 8) {
		return true;
	}

	if(e.keyCode == 32) {
		return false;
	}

	if(reg.test(value)) {
		return false;
	}

});

function generate(){
	var device_sn=$('#equipment').val();
	window.location.href="http://ht.hiberbest.com/mobile/login.html?device_sn="+device_sn;	
	// $.ajax({
	// 	type:"get",
	// 	url:"http://ht.hiberbest.com/mobile/login.html?device_sn="+device_sn,
	// 	success:function(data){

	// 		var data1=JSON.parse(data);
	// 		//console.log(data1);
	// 		var success=data1.success;
	// 		var error=data1.error;
	// 		if(success.code== 4008){
	// 			alert(success.message);
	// 			$('#equipment').focus();
	// 			$('.codebox').hide();
	// 			return false;
	// 		}

	// 		if(success.code== 4006){
	// 			alert(success.message);
	// 			$('#equipment').focus();
	// 			$('.codebox').hide();
	// 			return false;
	// 		}

	// 		if(success.code== 4000){
	// 			var Device=data1.Device;
	// 			$('#imgcode').attr("src",Device[0].QRcode);
	// 			$('.codebox').show();
	// 			return false;
	// 		}


	// 	},error:function(data){
	// 		alert("请检查您的网络！再重新获取");
	// 	}
	// })
}

</script>



</html>
